<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/reset.css">
    <script src="./js/index.js"></script>
    <link rel="stylesheet" href="./css/movie.css">
    <link rel="stylesheet" href="./css/footer.css">
    <title>movie</title>
</head>

<body>
    <!-- 头部标题开始 -->
    <div class="header">
        <p class="city">上海<span></span></p>
        <p class="check"><a href="#" class="active">正在热映</a><a href="#">即将上映</a></p>
        <span class="icon"></span>
    </div>
    <!-- 头部标题结束 -->
    <!-- 票房开始 -->
    <div class="box-office">
        <p>
            <span class="icon"></span>
            <span>实时票房</span>
            <span>2019-03-27</span>
        </p>
        <p>
            <span>今日大盘</span>
            <i>2918万</i>
            <a href="#"><span class="icon"></span></a>
        </p>
    </div>
    <!-- 票房结束 -->
    <!-- 电影列表开始 -->
    <div class="movie-list">
        <div class="movie-1 movie-all">
            <img src="./images/source/movie_1.jpg" alt="八佰">
            <div class="movie-intro">
                <h2>八佰</h2>
                <p>导演：管虎</p>
                <p class="performer">主演：<span>黄志忠</span><span>欧豪</span><span>王千源</span></p>
                <p class="advantage"><span>2D</span><span>国语</span><span>中国巨幕</span></p>
                <div class="movie-intro-bottom">
                    <div>
                        <p>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span>10分</span>
                        </p>
                        <span class="time">上映时间:2020-08-01</span>
                    </div>
                    <button>
                        购票
                    </button>
                </div>
            </div>
        </div>
        <div class="movie-2 movie-all">
            <img src="./images/source/movie_2.jpg" alt="我在时间尽头等你">
            <div class="movie-intro">
                <h2>我在时间尽头等你</h2>
                <p>导演：姚婷婷</p>
                <p class="performer">主演：<span>李鸿其</span><span>李一桐</span><span>范伟</span></p>
                <p class="advantage"><span>2D</span><span>国语</span><span>中国巨幕</span></p>
                <div class="movie-intro-bottom">
                    <div>
                        <p>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span>10分</span>
                        </p>
                        <span class="time">上映时间:2020-08-01</span>
                    </div>
                    <button>
                        购票
                    </button>
                </div>
            </div>
        </div>
        <div class="movie-3 movie-all">
            <img src="./images/source/movie_3.jpg" alt="荞麦疯长">
            <div class="movie-intro">
                <h2>荞麦疯长</h2>
                <p>导演：徐展雄</p>
                <p class="performer">主演：<span>前小库</span><span>大飞</span><span>张思思</span></p>
                <p class="advantage"><span>2D</span><span>国语</span><span>中国巨幕</span></p>
                <div class="movie-intro-bottom">
                    <div>
                        <p>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span>10分</span>
                        </p>
                        <span class="time">上映时间:2020-08-01</span>
                    </div>
                    <button>
                        购票
                    </button>
                </div>
            </div>
        </div>
        <div class="movie-4 movie-all">
            <img src="./images/source/movie_4.jpg" alt="哈利波特与魔法石">
            <div class="movie-intro">
                <h2>哈利波特与魔法石</h2>
                <p>导演：克里斯·哥伦布</p>
                <p class="performer">主演：<span>丹尼尔·雷德克里夫鲁伯特·格林特</span></p>
                <p class="advantage"><span>2D</span><span>国语</span><span>中国巨幕</span></p>
                <div class="movie-intro-bottom">
                    <div>
                        <p>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span>10分</span>
                        </p>
                        <span class="time">上映时间:2020-08-01</span>
                    </div>
                    <button>
                        购票
                    </button>
                </div>
            </div>
        </div>
        <div class="movie-5 movie-all">
            <img src="./images/source/movie_5.jpg" alt="寻梦环游记">
            <div class="movie-intro">
                <h2>寻梦环游记</h2>
                <p>导演：李·昂克里奇</p>
                <p class="performer">主演：<span>安东尼·刚萨雷斯本杰明·布拉特</span><span>欧豪</span><span>王千源</span></p>
                <p class="advantage"><span>2D</span><span>国语</span><span>中国巨幕</span></p>
                <div class="movie-intro-bottom">
                    <div>
                        <p>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span>10分</span>
                        </p>
                        <span class="time">上映时间:2020-08-01</span>
                    </div>
                    <button>
                        购票
                    </button>
                </div>
            </div>
        </div>
        <div class="movie-6 movie-all">
            <img src="./images/source/movie_6.jpg" alt="假面饭店">
            <div class="movie-intro">
                <h2>假面饭店</h2>
                <p>导演：某某</p>
                <p class="performer">主演：<span>某某某</span><span>某某某</span><span>某某某</span></p>
                <p class="advantage"><span>2D</span><span>国语</span><span>中国巨幕</span></p>
                <div class="movie-intro-bottom">
                    <div>
                        <p>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span class="icon"></span>
                            <span>10分</span>
                        </p>
                        <span class="time">上映时间:2020-08-01</span>
                    </div>
                    <button>
                        购票
                    </button>
                </div>
            </div>
        </div>
    </div>
    <!-- 电影列表结束 -->
    <!-- 底部通栏开始 -->
    <div class="footer">
        <div class="index">
            <a href="./index.html">
                <span class="icon icon1"></span>
                <span>首页</span>
            </a>
        </div>
        <div class="movie">
            <a href="./movie.html" class="active">
                <span class="icon icon2"></span>
                <span>电影</span>
            </a>
        </div>
        <div class="cinema">
            <a href="./cinema.html">
                <span class="icon icon3"></span>
                <span>电影院</span>
            </a>
        </div>
        <div class="find">
            <a href="./find.html">
                <span class="icon icon4"></span>
                <span>发现</span>
            </a>
        </div>
        <div class="my">
            <a href="./my.html">
                <span class="icon icon5"></span>
                <span>我的</span>
            </a>
        </div>
    </div>
    <!-- 底部通栏结束 -->
</body>

</html>